import dayjs from 'dayjs'
import { Calendar } from '@fullcalendar/core'
import dayGridPlugin from '@fullcalendar/daygrid'
import interactionPlugin from '@fullcalendar/interaction'
import timeGridPlugin from '@fullcalendar/timegrid'

/**
 * 日程配置参数
 */
export const calendarConfig = {
  height: 'auto',
  slotMinTime: '08:00',
  slotMaxTime: '18:00',
  allDaySlot: false,
  firstDay: (new Date()).getDay(),
  initialDate: new Date(),
  buttonText: {
    today: '今天',
    month: '月视图',
    week: '周视图',
    day: '日视图',
    list: '列表视图'
  },
  locale: 'zh-cn',
  slotLabelFormat: {
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit',
    meridiem: false,
    hour12: false
  },
  /**
   * 月视图 每天最多显示几个事件
   */
  dayMaxEventRows: 3,
  /**
   * 自定义标题模板
   * @param arg
   */
  // eventContent(arg) {
  //   return { html: `<div>${arg.event.title}</div>` }
  // },
  editable: true,
  selectable: true,
  /**
   * 禁止拖动
   */
  eventStartEditable: false,
  /**
   * 禁止拖动资源
   */
  eventResourceEditable: false
}

/**
 * 初始化普通视图日程
 * @param element 挂载元素
 * @param select 日期选择事件
 * @param eventClick 事件点击
 * @param updateDateEvent 更新日期事件
 */
export const initCommonCalendar = (element: HTMLElement,
  select: Function,
  eventClick: Function,
  updateDateEvent: Function) => {
  const { height, slotMinTime, slotMaxTime, allDaySlot, firstDay, initialDate, buttonText,
    locale, dayMaxEventRows, editable, selectable, eventStartEditable } = calendarConfig

  const plugins = [dayGridPlugin, interactionPlugin, timeGridPlugin]
  const initialView = 'dayGridMonth'
  const headerToolbar = {
    left: 'timeGridDay,timeGridWeek,dayGridMonth',
    center: 'title',
    right: 'prev,today,next'
  }

  return new Calendar(element, {
    height,
    plugins,
    initialView,
    slotMinTime,
    slotMaxTime,
    allDaySlot,
    firstDay,
    initialDate,
    headerToolbar,
    buttonText,
    locale,
    slotLabelFormat: {
      hour: '2-digit',
      minute: '2-digit',
      meridiem: false,
      hour12: false
    },
    dayMaxEventRows,
    editable,
    selectable,
    eventStartEditable,
    select,
    eventClick,
    datesSet: updateDateEvent
  })
}

export const initMobileCalendar = (element: HTMLElement,
  select: Function,
  eventClick: Function,
  updateDateEvent: Function) => {
  const { height, slotMinTime, slotMaxTime, allDaySlot, firstDay, initialDate, buttonText,
    locale, dayMaxEventRows, editable, selectable, eventStartEditable } = calendarConfig

  const plugins = [dayGridPlugin, interactionPlugin, timeGridPlugin]
  const initialView = 'weekView'
  const headerToolbar = {
    left: 'dayView,weekView',
    center: 'title',
    right: 'prev,today,next'
  }

  return new Calendar(element, {
    height,
    plugins,
    initialView,
    views: {
      dayView: {
        type: 'timeGrid',
        buttonText: '日'
      },
      weekView: {
        type: 'timeGrid',
        duration: { days: 4 },
        buttonText: '周'
      }
    },
    slotMinTime,
    slotMaxTime,
    allDaySlot,
    firstDay,
    initialDate,
    headerToolbar,
    buttonText,
    locale,
    slotLabelFormat: {
      hour: '2-digit',
      minute: '2-digit',
      meridiem: false,
      hour12: false
    },
    dayMaxEventRows,
    editable,
    selectable,
    eventStartEditable,
    select,
    eventClick,
    datesSet: updateDateEvent
  })
}

export const getRemainDays = (targetDate: string): string => {
  const today = dayjs()
  const target = dayjs(targetDate)

  const totalDays = target.diff(today, 'days')

  const isExpired = totalDays < 0
  const isToday = totalDays === 0
  const absTotalDays = Math.abs(totalDays)

  // 计算年、月、周、天
  const years = Math.floor(absTotalDays / 365)
  const months = Math.floor((absTotalDays % 365) / 30)
  const weeks = Math.floor((absTotalDays % 30) / 7)
  const days = absTotalDays % 7

  // 根据不同情况返回不同的结果
  let result = ''
  if (isToday) {
    result = '今天到期'
  } else {
    const type = isExpired ? '过期' : '剩余'
    result = `${type}: `
    if (years > 0) result += `${years}年 `
    if (months > 0) result += `${months}个月 `
    if (weeks > 0) result += `${weeks}周 `
    if (days > 0) result += `${days}天`
  }

  return result.trim()
}

export const isBeforeToday = (targetDate: string) => {
  return dayjs(targetDate).isBefore(dayjs(), 'day')
}

export const isBeforeTime = (startTime: string, endTime: string) => {
  return dayjs(startTime, 'HH:mm').isBefore(dayjs(endTime, 'HH:mm'))
}
